<div class="row">
    <div class="col-lg-4 col-sm-12 col-xs-12">
        <div class="widget radius-bordered nomargin-bottom">
            <div class="widget-header">
                <span class="widget-caption">设置对象</span>
                <div class="widget-buttons">
                    <a href="#" data-toggle="maximize">
                        <i class="fa fa-expand"></i>
                    </a>
                    <a href="#" data-toggle="collapse">
                        <i class="fa fa-minus"></i>
                    </a>
                </div>
            </div>
            <div class="widget-body  no-padding" style="max-height: 694px;height: 694px;">
                <div class="tabbable">
                    <ul class="nav nav-tabs ">
                        <li class="active">
                            <a data-toggle="tab" href="#roleList" >角色</a>
                        </li>
                        <li class="tab-red">
                            <a data-toggle="tab" href="#userList">用户</a>

                        </li>
                    </ul>
                    <div class="tab-content" style="max-height: 660px;height: 660px;">
                        <div id="roleList" class="tab-pane in active">
                            <div class="row">
                                <div class="col-lg-12 col-sm-12 col-xs-12" id="roleDataList">
                                    <#-- 动态加载角色列表  -->
                                </div>
                            </div>
                        </div>
                        <div id="userList" class="tab-pane">
                            <div class="row">
                                <div class="col-lg-12 col-sm-12 col-xs-12" id="userDataList">
                                    <#-- 动态加载用户列表  -->
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-lg-4 col-sm-12 col-xs-12" id="center">
        <div class="row">
            <div class="widget radius-bordered nomargin-bottom">
                <div class="widget-header">
                    <span class="widget-caption">菜单权限<span id="nowSetObjInfo"></span></span>
                    <div class="widget-buttons">
                        <a href="#" data-toggle="maximize">
                            <i class="fa fa-expand"></i>
                        </a>
                        <a href="#" data-toggle="collapse">
                            <i class="fa fa-minus"></i>
                        </a>
                        <a href="javascript:" onclick="setPermissionWeight()" data-toggle="config">
                            <i class="fa fa-cog"></i>
                        </a>
                    </div>
                </div>
                <div class="widget-body nopadding" id="menuPermissionsTree" style="max-height: 694px;height: 694px;overflow:auto;">
                    <!-- 动态加载菜单权限面板 -->
                    <p>请在左侧选择需要设置菜单权限的角色或用户!</p>
                </div>
            </div>
        </div>
    </div>
    <div class="col-lg-4 col-sm-12 col-xs-12">
        <div class="widget radius-bordered nomargin-bottom">
            <div class="widget-header">
                <span class="widget-caption">菜单<span id="menuPermissionDetails"></span>操作权限设置</span>
                <div class="widget-buttons">
                    <a href="#" data-toggle="maximize">
                        <i class="fa fa-expand"></i>
                    </a>
                    <a href="#" data-toggle="collapse">
                        <i class="fa fa-minus"></i>
                    </a>
                </div>
            </div>
            <div class="widget-body no-padding" id="right" style="max-height: 694px;height: 694px;">
                <div class="tabbable">
                    <ul class="nav nav-tabs ">
                        <li class="active">
                            <a data-toggle="tab" href="#permissionDetailData">基础信息</a>
                        </li>
                        <li class="tab-red">
                            <a data-toggle="tab" href="#handlePermissionListData">菜单操作权限</a>
                        </li>
                        <li class="tab-red">
                            <a data-toggle="tab" href="#handlePermissionAllotData">操作权限分配</a>
                        </li>
                    </ul>
                    <div class="tab-content" style="height: 660px;">
                        <div id="permissionDetailData" class="tab-pane in active">
                            <div class="row">
                                <div class="col-lg-12 col-sm-12 col-xs-12" id="permissionDetail">
                                    <#-- 动态加载菜单权限详情  -->
                                        <p>请在左侧点击菜单权限后边的设置按钮查看详细信息!</p>
                                </div>
                            </div>
                        </div>
                        <div id="handlePermissionListData" class="tab-pane">
                            <div class="row">
                                <div class="col-lg-12 col-sm-12 col-xs-12" id="handlePermissionList">
                                    <#-- 动态加载菜单操作权限 -->
                                        <p>请在左侧选择已勾选的菜单权限,进行操作权限设置!</p>
                                </div>
                            </div>
                        </div>
                        <div id="handlePermissionAllotData" class="tab-pane">
                            <div class="row">
                                <div class="col-lg-12 col-sm-12 col-xs-12" id="handlePermissionAllot">
                                    <#-- 动态加载菜单操作权限 -->
                                        <p>请在左侧选择已勾选的菜单权限,进行操作权限设置!</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div clas="row">
        <div class="col-lg-12 col-sm-12 col-xs-12">
            <div class="widget radius-bordered nomargin-bottom">
                <div class="widget-header">
                    <span class="widget-caption"><a name="settings"></a>操作权限详情设置<span id="nowSetHandlePermission"></span></span>
                </div>
                <div class="widget-body nopadding-bottom">
                    <div class="row">
                        <div class="col-lg-3 col-sm-6 col-xs-6  nopadding-top">
                            <div class="widget radius-bordered">
                                <div class="widget-header header-small">
                                    <span class="widget-caption">class属性</span>
                                    <div class="widget-buttons">
                                        <button class="btn btn-default btn-xs icon-only" style="margin-top:2.3px;" onclick="(function(){if(typeof(addHandlePermissClass)==='function'){addHandlePermissClass()}else{alert('请在选择已勾选的菜单权限,再选择需要设置的操作权限!')}})()" title="新增"><i class="fa fa-plus yellow"></i></button>
                                    </div>
                                </div>
                                <div class="widget-body nopadding-bottom" style="height: 453px;" id="handlePermissionsClassList">
                                    <#--动态加载class列表-->
                                        请在选择已勾选的菜单权限,再选择需要设置的操作权限!
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-sm-6 col-xs-6 nopadding-top">
                            <div class="widget radius-bordered">
                                <div class="widget-header header-small">
                                    <span class="widget-caption">行内样式</span>
                                    <div class="widget-buttons">
                                        <button class="btn btn-default btn-xs icon-only" style="margin-top:2.3px;" onclick="(function(){if(typeof(addHandlePermissStyle)==='function'){addHandlePermissStyle()}else{alert('请在选择已勾选的菜单权限,再选择需要设置的操作权限!')}})()" title="新增"><i class="fa fa-plus yellow"></i></button>
                                    </div>
                                </div>
                                <div class="widget-body nopadding-bottom" style="height: 453px;" id="handlePermissionsStyleList">
                                    <#--动态加载style列表-->
                                        请在选择已勾选的菜单权限,再选择需要设置的操作权限!
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-sm-6 col-xs-6 nopadding-top">
                            <div class="widget radius-bordered">
                                <div class="widget-header header-small">
                                    <span class="widget-caption">事件</span>
                                    <div class="widget-buttons">
                                        <button class="btn btn-default btn-xs icon-only" style="margin-top:2.3px;" onclick="(function(){if(typeof(addHandlePermissEvent)==='function'){addHandlePermissEvent()}else{alert('请在选择已勾选的菜单权限,再选择需要设置的操作权限!')}})()" title="新增"><i class="fa fa-plus yellow"></i></button>
                                    </div>
                                </div>
                                <div class="widget-body nopadding-bottom" style="height: 453px;" id="handlePermissionsEventList">
                                    <#--动态加载event列表-->
                                        请在选择已勾选的菜单权限,再选择需要设置的操作权限!
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-sm-6 col-xs-6 nopadding-top">
                            <div class="widget radius-bordered">
                                <div class="widget-header header-small">
                                    <span class="widget-caption">自定义属性</span>
                                    <div class="widget-buttons">
                                        <button class="btn btn-default btn-xs icon-only" style="margin-top:2.3px;" onclick="(function(){if(typeof(addHandlePermissAttr)==='function'){addHandlePermissAttr()}else{alert('请在选择已勾选的菜单权限,再选择需要设置的操作权限!')}})()" title="新增"><i class="fa fa-plus yellow"></i></button>
                                    </div>
                                </div>
                                <div class="widget-body nopadding-bottom" style="height: 453px;" id="handlePermissionsAttrList">
                                    <#--动态加载customer attr列表-->
                                        请在选择已勾选的菜单权限,再选择需要设置的操作权限!
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="row">
    <div class="col-lg-12 col-sm-12 col-xs-12">
        <div class="widget nomargin-top">
            <div class="widget-header">
                <i class="widget-icon fa fa-gears"></i>
                <span class="widget-caption">权限导入导出</span>
                <div class="widget-buttons">
                    <a href="#" data-toggle="maximize">
                        <i class="fa fa-expand"></i>
                    </a>
                    <a href="#" data-toggle="collapse">
                        <i class="fa fa-minus"></i>
                    </a>
                    <a href="#" data-toggle="dispose">
                        <i class="fa fa-times"></i>
                    </a>
                </div><!--Widget Buttons-->
            </div><!--Widget Header-->
            <div class="widget-body">
                <textarea  id="settingJSON" style="width: 100%; height: 600px; resize: none;" placeholder="权限设置JSON格式配置信息"></textarea>
                <div class="margin-top-10 text-align-right">
                    <a class="btn  theme" onclick="genSettingJSON()"><i class="fa fa-cloud-download"></i>导出菜单及操作权限</a>
                    <a class="btn  theme" onclick="importConfig()"><i class="fa fa-cloud-upload"></i>导入菜单及操作权限</a>
                </div>
            </div><!--Widget Body-->
        </div><!--Widget-->
    </div>
</div>
<a id="reloadHandlePermissionDetails" href="javascript:" onclick="reloadHandlePermissionDetails()"></a>
<script src="assets/js/fuelux/treeview/tree-custom.min.js"></script>
<script type="text/javascript">
    //加载角色列表
    loadRoleList("roleDataList");
    //加载用户列表
    loadUserList("userDataList");
    //设置权限
    function setPermission(checkedId,objTypeListId,nowSetObjName,a) {
        console.log("checkedIds=" + checkedId);
        var isSetRole = objTypeListId == "roleListId";
        $("#nowSetObjInfo").html("【正在设置<span id='nowSetObj'>" + (isSetRole ? "角色：<span style='color:red'>" : "用户：<span style='color:blue'>") + nowSetObjName + "</span></span> 的菜单权限】").css("color", (isSetRole ? "blue" : "red"));
        $("#menuPermissionsTree").load("switchView.do?viewPath=sysPage/platform/permission/menuPermissionTree.html&checkedCallback=allotPermission&permissionDetailCallback=permissionDetail&objType=" + (isSetRole ? "role" : "user") + "&objId=" + checkedId, function () {
            loadAjaxTree("menuPermissionTree");
            $("#permissionDetail").html("<p>请在左侧点击菜单权限后边的设置按钮查看详细信息!</p>");
            $("#handlePermissionList").html("<p>请在左侧选择已勾选的菜单权限,进行操作权限设置!</p>");
            $("#handlePermissionAllot").html("<p>请在左侧选择已勾选的菜单权限,进行操作权限设置!</p>");
            clearHandlePermissDetails();
        });
    }
    //调整菜单权限附属关系
    function setPermissionWeight(){
        $("#nowSetObjInfo").html("【正在调整菜单权限附属关系】");
        $("#menuPermissionsTree").load("switchView.do?viewPath=sysPage/platform/permission/menuPermissionNestableList.html");
    }

    //加载当前角色/用户所分配到的操作权限
    function loadNowMenuAllHandlePermission( objType, objId, menuPermissionId){
        if (!$("[value='" + menuPermissionId + "']").get(0).checked) {
            $("#handlePermissionAllot").html("选择已勾选的菜单权限,进行操作权限分配!");
            return;
        }
        ajaxRequest("permissionSetting/loadNowMenuAllHandlePermissionAllot.do?objType=" + objType + "&objId=" + objId + "&menuPermissionId=" + menuPermissionId, null, function (html) {
                $("#handlePermissionAllot").html(html);
                var loadImg = $(".pagingBar .pagingininfo .loadingImg");
                loadImg.hide();
                clearHandlePermissDetails();
            },
            function (XMLHttpRequest, textStatus, errorThrown) {
                ajaxError(errorThrown);
            },
            "GET", "HTML");
    }
    /**
     * 加载菜单操作权限列表
     * @param containerId 列表显示容器Id
     * @param searchFromId 列表搜索表单id
     */
    function loadhandlePermissionList(containerId, searchFromId, objType, objId, menuPermissionId) {
        var method = "POST";
        var params = {};
        var viewPath = "permissionSetting/handlePermissionList.do?searchFormId=" + searchFromId + "&containerId=" + containerId + "&objType=" + objType + "&objId=" + objId + "&menuPermissionId=" + menuPermissionId;
        if (!searchFromId) {
            searchFromId = "handlePermissionListSearchForm" + new Date().getTime();
        } else {
            params = $("#" + searchFromId).serializeArray();
            viewPath = "permissionSetting/handlePermissionList.do";
        }
        ajaxRequest(viewPath, params, function (html) {
            $("#" + containerId).html(html);
            var loadImg = $(".pagingBar .pagingininfo .loadingImg");
            loadImg.hide();
            clearHandlePermissDetails();
        },
        function (XMLHttpRequest, textStatus, errorThrown) {
            ajaxError(errorThrown);
        },
        method, "HTML");
        //加载当前角色/用户所分配到的操作权限
        loadNowMenuAllHandlePermission(objType, objId, menuPermissionId);
    }
    /**
     * 加载操作权限的class列表
     * @param containerId 容器id
     * @param searchFormId 搜索表单Id
     * @param handlePermissionId 操作权限Id
     */
    function loadHandlePermissionClassList(containerId, searchFormId,handlePermissionId){
        var method = "POST";
        var params = {};
        var viewPath = "permissionSetting/handlePermissionsClassesList.do?searchFormId=" + searchFormId + "&containerId=" + containerId + "&handlePermissionId=" + handlePermissionId ;
        if (!searchFormId) {
            searchFormId = "handlePermissionClassListSearchForm" + new Date().getTime();
        } else {
            params = $("#" + searchFormId).serializeArray();
            viewPath = "permissionSetting/handlePermissionsClassesList.do";
        }
        ajaxRequest(viewPath, params, function (html) {
            $("#" + containerId).html(html);
            var loadImg = $(".pagingBar .pagingininfo .loadingImg");
            loadImg.hide();
        },
        function (XMLHttpRequest, textStatus, errorThrown) {
            ajaxError(errorThrown);
        },
        method, "HTML");
    }
    /**
     * 加载操作权限的style列表
     * @param containerId 容器id
     * @param searchFormId 搜索表单Id
     * @param handlePermissionId 操作权限Id
     */
    function loadHandlePermissionStyleList(containerId, searchFormId,handlePermissionId){
        var method = "POST";
        var params = {};
        var viewPath = "permissionSetting/handlePermissionsStyleList.do?searchFormId=" + searchFormId + "&containerId=" + containerId + "&handlePermissionId=" + handlePermissionId ;
        if (!searchFormId) {
            searchFormId = "handlePermissionStyleListSearchForm" + new Date().getTime();
        } else {
            params = $("#" + searchFormId).serializeArray();
            viewPath = "permissionSetting/handlePermissionsStyleList.do";
        }
        ajaxRequest(viewPath, params, function (html) {
            $("#" + containerId).html(html);
            var loadImg = $(".pagingBar .pagingininfo .loadingImg");
            loadImg.hide();
        },
        function (XMLHttpRequest, textStatus, errorThrown) {
            ajaxError(errorThrown);
        },
        method, "HTML");
    }
    /**
     * 加载操作权限的event列表
     * @param containerId 容器id
     * @param searchFormId 搜索表单Id
     * @param handlePermissionId 操作权限Id
     */
    function loadHandlePermissionEventList(containerId, searchFormId,handlePermissionId){
        var method = "POST";
        var params = {};
        var viewPath = "permissionSetting/handlePermissionsEventList.do?searchFormId=" + searchFormId + "&containerId=" + containerId + "&handlePermissionId=" + handlePermissionId ;
        if (!searchFormId) {
            searchFormId = "handlePermissionStyleListSearchForm" + new Date().getTime();
        } else {
            params = $("#" + searchFormId).serializeArray();
            viewPath = "permissionSetting/handlePermissionsEventList.do";
        }
        ajaxRequest(viewPath, params, function (html) {
            $("#" + containerId).html(html);
            var loadImg = $(".pagingBar .pagingininfo .loadingImg");
            loadImg.hide();
        },
        function (XMLHttpRequest, textStatus, errorThrown) {
            ajaxError(errorThrown);
        },
        method, "HTML");
    }
    /**
     * 加载操作权限的attr列表
     * @param containerId 容器id
     * @param searchFormId 搜索表单Id
     * @param handlePermissionId 操作权限Id
     */
    function loadHandlePermissionAttrList(containerId, searchFormId,handlePermissionId){
        var method = "POST";
        var params = {};
        var viewPath = "permissionSetting/handlePermissionsAttrList.do?searchFormId=" + searchFormId + "&containerId=" + containerId + "&handlePermissionId=" + handlePermissionId ;
        if (!searchFormId) {
            searchFormId = "handlePermissionStyleListSearchForm" + new Date().getTime();
        } else {
            params = $("#" + searchFormId).serializeArray();
            viewPath = "permissionSetting/handlePermissionsAttrList.do";
        }
        ajaxRequest(viewPath, params, function (html) {
            $("#" + containerId).html(html);
            var loadImg = $(".pagingBar .pagingininfo .loadingImg");
            loadImg.hide();
        },
        function (XMLHttpRequest, textStatus, errorThrown) {
            ajaxError(errorThrown);
        },
        method, "HTML");
    }
    /**
     * 加载操作权限详情
     * @param handlePermissionId 操作权限Id
     */
    function loadhandlePermissDetails(handlePermissionId,menuPermissionName,handlePermissionName){
        $("#nowSetHandlePermission").html("【正在对"+$("#nowSetObj").html()+" 的菜单权限<span class='red'>"+menuPermissionName+"</span> 下:<span class='red'>"+handlePermissionName+" </span>操作权限进行相关配置】");
        loadHandlePermissionClassList("handlePermissionsClassList" , undefined , handlePermissionId);
        loadHandlePermissionStyleList("handlePermissionsStyleList" , undefined , handlePermissionId);
        loadHandlePermissionEventList("handlePermissionsEventList" , undefined , handlePermissionId);
        loadHandlePermissionAttrList("handlePermissionsAttrList" , undefined , handlePermissionId);
    }

    function clearHandlePermissDetails(){
        $("#handlePermissionsClassList,#handlePermissionsStyleList,#handlePermissionsEventList,#handlePermissionsAttrList").html("请在选择已勾选的菜单权限,再选择需要设置的操作权限!");
    }

    function reloadHandlePermissionDetails(){
        $("#addHandlePermissionAttr_search").click();
        $("#addHandlePermissionClass_search").click();
        $("#addHandlePermissionEvent_search").click();
        $("#addHandlePermissionStyle_search").click();

    }

    /**
     * 权限分配
     * @param checkbox 被选中的菜单权限复选框dom对象
     */
    function allotPermission(checkbox) {
        var that = $(checkbox);
        var url = "permissionSetting/allotPermission.do";
        ajaxRequest(url, {
            objType: that.attr("objType"),
            objId: that.attr("objId"),
            menuPermissionId: that.val(),
            op: checkbox.checked
        }, function (data) {
            if (data.resCode != 200) {
                ajaxError(data.resMsg);
            }else{
            	if(!checkbox.checked){
            		$("#handlePermissionAllot").html("已取消菜单权限分配,请重新选择已勾选的菜单权限,进行操作权限分配!");
            	}
            }
        },
        function (XMLHttpRequest, textStatus, errorThrown) {
            ajaxError(errorThrown);
        }, "GET", "JSON");
    }

    /**
     * 菜单权限详情
     * @param menuPermissionId 菜单权权限Id
     * @param objType 设置对象类型
     * @param objId 设置对象id
     * @returns {boolean}
     */
    function permissionDetail(menuPermissionId, objType, objId) {
        loadhandlePermissionList("handlePermissionList", undefined, objType, objId, menuPermissionId);
        ajaxRequest("permissionSetting/getPermission.do", {
            menuPermissionId: menuPermissionId
        }, function (html) {
            $("#permissionDetail").html(html);
            $("#menuPermissionDetails").html("【"+$("#permissionDetailData [name='name']").val()+"】").css({"color":"red"});
        },
        function (XMLHttpRequest, textStatus, errorThrown){
            ajaxError(errorThrown);
        }, "GET", "html");
        return false;
    }

    /**
     * 生成设设置相关参数
     */
    function genSettingJSON() {
        var iframe='<iframe id="downSettingConfig" src="preserve/database/genSettingJSON.do" style="display: none;"></iframe>';
        $("#downSettingConfig").remove();
        $("body").append(iframe);
    }

    /**
     * 导入设置
     */
    function importConfig() {
        ajaxRequest("preserve/database/importConfig.do", {
            jsonConfig: $("#settingJSON").val()
        }, function (result) {
            alert(result.resMsg);
        },
        function (XMLHttpRequest, textStatus, errorThrown) {
            ajaxError(errorThrown);
        }, "POST", "json");
    }
</script>